<template>
    <div class="main-container">
        <div style="background-color: #fff;height:100%">
            <a-tabs :lazy-load="true" type="card" @change="tabsChange" justify>
                <a-tab-pane title="组织架构" key="1" v-if="permissionStore.hasPermisson('zzjg.zzjg')">
                    <div style="height: 100%;">
                        <OrganizationalStructure></OrganizationalStructure>
                    </div>
                </a-tab-pane>
                <a-tab-pane title="岗位列表" key="2" v-if="permissionStore.hasPermisson('zzjg.gwlb')">
                    <div style="height: 100%;">
                        <PositionList></PositionList>
                    </div>
                </a-tab-pane>
                <a-tab-pane title="员工列表" key="3" v-if="permissionStore.hasPermisson('zzjg.yglb')">
                    <div style="height: 100%;">
                        <EmployeeList></EmployeeList>
                    </div>
                </a-tab-pane>
                <a-tab-pane title="职务列表" key="4" v-if="permissionStore.hasPermisson('zzjg.zwlb')">
                    <div style="height: 100%;">
                        <JobList></JobList>
                    </div>
                </a-tab-pane>
                <a-tab-pane title="目标产能设置" key="5" v-if="permissionStore.hasPermisson('zzjg.zwlb')">
                    <div style="height: 100%;">
                        <muBiaoShengchan></muBiaoShengchan>
                    </div>
                </a-tab-pane>
                <a-tab-pane title="出勤班次设定" key="6">
                    <div style="height: 100%;">
                        <attendanceShift></attendanceShift>
                    </div>
                </a-tab-pane>
            </a-tabs>
        </div>

    </div>
</template>

<script lang="ts">
import { defineComponent, reactive } from 'vue'
import emitter from '@/hooks/useEventBus'
import usePermission from '@/store/modules/permission'
import muBiaoShengchan from './components/muBiaoShengchan.vue'
import attendanceShift from './components/attendanceShift.vue'
export default defineComponent({
    name: 'UserManager',
    setup() {

        const pageData = reactive({
            tableIndex: "1"
        })

        const permissionStore = usePermission()
        const tabsChange = (e: string | number) => {
            emitter.emit('window-change')
            if (e === '2') {
                    emitter.emit('refresh-PositionList')
                }else if (e === '3') {
                    emitter.emit('refresh-EmployeeList')
                } else if (e === '4') {
                    emitter.emit('refresh-JobList')
                }
                
        };
        return {
            pageData,
            tabsChange,
            permissionStore
        }
    },
    components: { muBiaoShengchan,attendanceShift }
})
</script>

<style scoped>
.main-container {
    height: 100%;
}
</style>